<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript">
			var fun1=function(){
				/* 3. 获取元素之后，为元素添加事件监听 */
				var btn=document.querySelector("button");
				btn.addEventListener("click",fun2,false);
				
			}
			function fun2(){
				alert("按钮被点击");
			}
		</script>
	</head>
	<body>
		<button>按钮</button>
		<!-- 1. 直接在标签中处理事件 -->	
		<button onclick="fun1()">添加</button>
		<button>移除</button>
		<script type="text/javascript">
			var btn3=document.querySelectorAll("button")[2];
			/* 2. 获取元素之后，为事件属性赋值 */
			btn3.onclick=function(){
				var btn=document.querySelector("button");
				btn.removeEventListener("click",fun2,false);
			}
		</script>
	</body>
</html>
